<page-header [content]="content" [extra]="extra" [title]="'Magicodes工作控制台'">
  <ng-template #content>

    <p>Magicodes:是一个使用.NET Core和Angular搭建高性能、高可用的全栈开发框架。
    </p>
    <p> Magicodes 是一套快速开发模板，你只需要按照开发规范就可以快速实现功能开发，不用太多时间来处理基础设施等内容。</p>
    <div class="d-flex pt-md">
      <a class="d-flex pr-lg" target="_blank" href="#">
        <img class="pr-sm" src="https://gw.alipayobjects.com/zos/rmsportal/MjEImQtenlyueSmVEfUD.svg" />快速开始
      </a>
      <a class="d-flex pr-lg" target="_blank" href="#">
        <img class="pr-sm" src="https://gw.alipayobjects.com/zos/rmsportal/NbuDUAuBlIApFuDvWiND.svg" />产品简介
      </a>
      <a class="d-flex pr-lg" target="_blank" href="#">
        <img class="pr-sm" src="https://gw.alipayobjects.com/zos/rmsportal/ohOEPSYdDTNnyMbGuyLb.svg" />产品文档
      </a>
      <a class="d-flex" target="_blank" href="https://cloud.xin-lai.com">
        <img class="pr-sm" src="https://gw.alipayobjects.com/zos/rmsportal/ohOEPSYdDTNnyMbGuyLb.svg" />配套代码生成器
      </a>
    </div>
  </ng-template>
  <ng-template #extra>
    <div style="margin-top: -60px; text-align: center; width: 200px;">
      <img class="img-fluid" src="https://images.gitee.com/uploads/group/241434814461645.png">
    </div>
  </ng-template>
</page-header>

<div nz-row [nzGutter]="24">
  <div nz-col nzXs="24" nzSm="24" nzMd="24">
    <nz-card nzTitle="Magicodes中的技术栈" [nzBordered]="false" [nzLoading]="loading" class="ant-card__body-nopadding mb-lg project-list">
      <div *ngFor="let item of notice" nz-card-grid class="project-grid">
        <nz-card [nzBordered]="false" class="ant-card__body-nopadding mb0">
          <nz-card-meta [nzTitle]="noticeTitle" [nzDescription]="item.description">
            <ng-template #noticeTitle>
              <div class="card-title">
                <nz-avatar [nzSrc]="item.logo" [nzSize]="'small'"></nz-avatar>
                <a [href]="item.href" target="_blank">{{item.title}}</a>
              </div>
            </ng-template>
          </nz-card-meta>
        </nz-card>
      </div>
    </nz-card>

  </div>


</div>


<!-- 更多资料  -->
<nz-row nzGutter="24">
  <nz-col nzSpan="24">
    <nz-card nzTitle="更多资料" [nzBordered]="false" [nzBodyStyle]="{'padding-top.px': 12, 'padding-bottom.px': 12 }" class="mb-lg">
      <div class="members">
        <div nz-row [nzGutter]="48">
          <div nz-col [nzSpan]="12" *ngFor="let i of members">
            <a href="{{i.link}}" target="_blank">
              <nz-avatar [nzSrc]="i.logo" [nzSize]="'small'"></nz-avatar>
              <span class="member">{{i.title}}</span>
            </a>
          </div>
        </div>
      </div>
    </nz-card>
  </nz-col>
</nz-row>
